<template>
    <div class="article-meta">
        <p class="tags">
            <i class="glyphicon glyphicon-tags"></i>
            <span v-for="t in list.tags" :key="t.id">
                {{ t.title }}
            </span>
        </p>
        <p>
            <i class="el-icon-view"></i>
            <span>{{ list.click }}</span>
        </p>
        <p>
            <i class="el-icon-chat-dot-round"></i>
            <span>0</span>
        </p>
        <p>
            <i class="el-icon-date"></i>
            <span>{{ list.created_time | formatTime }}</span>
        </p>
    </div>
</template>

<script>
export default {
    name: "blog-meta",
    props: {
        list: Object,
    },
};
</script>

<style lang="less" scoped>
.article-meta {
    border-top: 1px solid #b8c2cc;
    background: #f8fafc;
    border-bottom: 1px solid #b8c2cc;
    padding: 7px 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-weight: 600;
    color: #606f7b;
    font-family: auto;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    line-height: 28px;
    font-size: 15px;

    p {
        margin-right: 20px;
    }
}
</style>